<template>
  <div>
    <div id="main" :style="{ height: '400px', paddingTop: '40px' }"></div>
  </div>
</template>

<script>
import * as echarts from "echarts";
export default {
  name: "LoginData",
  data() {
    return {
      xcontent: [],
      url: "http://192.168.35.36:3005",
      series: [
        {
          name: "注册",
          type: "bar",
          data: [],
          showBackground: true,
          areaStyle: {},
          itemStyle: {
            opacity: 0.8,
            color: "#5470C6",
          },
        },
      ],
    };
  },
  created() {
    this.$axios
      .get(`${this.url}/totaldata/login`)
      .then((content) => {
        content.data.forEach((item) => {
          this.xcontent.push(item.time);
          this.series[0].data.push(item.arr.length);
          // 基于准备好的dom，初始化echarts实例
        });
      })
      .then(() => {
        var myChart = echarts.init(document.getElementById("main"));

        myChart.setOption({
          title: {
            text: "近7天app用户注册人数",
          },
          tooltip: {},
          xAxis: {
            data: this.xcontent,
          },
          yAxis: {},
          series: this.series,
        });

        window.onresize = function () {
          myChart.resize();
        };
      });
  },
  mounted() {},
};
</script>

<style>
</style>